<template>
  <n-scrollbar class="max-pdHeight">
    <n-layout embedded content-style="padding: 24px;">
      <n-space vertical>
        <Tip :title="item.title" type="code" v-for="item in arr" :key="item">
          <template #icon>
            <Link />
          </template>
          <template #content>
            <n-button
              text
              tag="a"
              :href="item.link"
              target="_blank"
              type="primary"
            >
              {{item.link}}
            </n-button>
          </template>
        </Tip>
      </n-space>
    </n-layout>
  </n-scrollbar>
</template>

<script>
import { defineComponent } from 'vue'
import Tip from '@/components/Tip/index.vue'
import { pluginLink1, pluginLink2, localLink, sourceLink1, sourceLink2, sourceLink3 } from './code'
import { Link } from '@vicons/ionicons5'
import { loading } from '@/utils/loading'

export default defineComponent({
  components: {
    Tip,
    Link
  },
  setup() {
    loading()
    const arr = [
      {
        title: 'Plugin 解析1 -- 作者：chirs',
        link: pluginLink1
      },
      {
        title: 'Plugin 解析2 -- 作者：chirs',
        link: pluginLink2
      },
      {
        title: '本地缓存分析-- 作者：chirs',
        link: localLink
      },
      {
        title: '源码解析1 -- 作者：小郭在深圳',
        link: sourceLink1
      },
      {
        title: '源码解析2 -- 作者：chirs',
        link: sourceLink2
      },
      {
        title: '源码解析3 -- 作者：chirs',
        link: sourceLink3
      },
    ]
    return { arr }
  }
})
</script>

<style lang="scss" scoped></style>
